<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HTML 表单元素</title>
</head>
<body>

    <!--
    <option> 元素定义待选择的选项。
    <select> 元素（下拉列表）
    列表通常会把首个选项显示为被选选项。
    您能够通过添加 selected 属性来定义预定义选项。
    -->
    <form action="www.delong.com/demo.asp">
        <select name="cars">
            <option value="volvo">Volvo</option>
            <option value="saab">Saab</option>
            <option value="fiat" selected="selected">FIAT</option>
            <option value="benzi">Benzi</option>
            <option value="bmw">BMW</option>
            <option value="binL">B</option>
        </select>
        <br/>
        <input type="submit"/>
    </form>
    <!--  textarea 元素 定义多行输入 字段 (文本域)-->
    <textarea name="message" rows="10" cols="30">
        The cat was playing in the garden
    </textarea>
    <button type="button" onclick="alert('Hello De Long')">Click Me!</button>

    <!--  HTML5 新增了 一些表单元素  datalist keygen output 这三个-->

    <!--  datalist 元素 为input 元素规定预定义选项列表
           用户会在他们输入数据时看到 预定义选项的下拉列表
           <input> 元素的list 属性必须引用 <datalist> 元素的id 属性
     -->
    <form action="action_page.php">
        <input list="browsers" name="browser" />
        <datalist id="browsers">
            <option value="internet explore"></option>
            <option value="firfox"></option>
        </datalist>
        <input type="submit"/>
    </form>

</body>
</html>










































